<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>addInfo</title>
    <link rel="stylesheet" href="/webjars/bootstrap/4.1.0/css/bootstrap.css">

</head>
<body>
<div class="container">
    <a class="btn btn-light" href="/">index</a>

    <form action="/info/save" id="addInfoForm">
        <input type="hidden" id="siteId" th:value="${info.siteid}">
        <div class="form-group">
            <label for="siteCode">siteCode</label>
            <input class="form-control" type="text" name="siteCode" id="siteCode"
                   th:value="${info.sitecode}">
        </div>

        <div class="form-group">
            <label for="siteName">siteName</label>
            <input class="form-control" type="text" name="siteName" id="siteName"
                   th:value="${info.sitename}">
        </div>

        <div class="form-group">
            <label for="longitude">longitude</label>
            <input class="form-control" type="text" name="longitude" id="longitude"
                   th:value="${info.longitude}">
        </div>

        <div class="form-group">
            <label for="latitude">latitude</label>
            <input class="form-control" type="text" name="latitude" id="latitude"
                   th:value="${info.latitude}">
        </div>


        <dl>
            <dd>
                <button type="button" id="sub" class="btn btn-success">submit</button>
                <button type="reset" class="btn btn-warning">reset</button>
                <button type="button" id="back" class="btn btn-light">back</button>
            </dd>
        </dl>
    </form>
</div>

<script type="application/javascript" src="/webjars/jquery/3.4.1/jquery.js"></script>
<script>
    $(function () {
        let $siteCode = $('#siteCode');
        let $siteName = $('#siteName');
        let $longitude = $('#longitude');
        let $latitude = $('#latitude');
        let $siteId = $('#siteId');


        $("#sub").on('click', () => {

            let siteCodeVal = $siteCode.val();
            let siteNameVal = $siteName.val();
            let longVal = $longitude.val();
            let latVal = $latitude.val();
            let siteIdVal = $siteId.val();

            if (null == siteCodeVal || '' == siteCodeVal.trim()) {
                alert("经检查siteCode输入的内容")
                return;
            }

            if (null == siteNameVal || '' == siteNameVal.trim()) {
                alert("经检查siteNameVal输入的内容")
                return;
            }

            if (null == longVal || '' == longVal.trim()) {
                alert("经检查longVal输入的内容")
                return;
            }

            if (null == latVal || '' == latVal.trim()) {
                alert("经检查latVal输入的内容")
                return;
            }
            $.ajax({
                url: '/info/modify',
                type: 'PUT',
                dataType: 'JSON',
                contextType: "application/json",
                data: {
                    siteid: siteIdVal,
                    sitecode: siteCodeVal,
                    sitename: siteNameVal,
                    longitude: longVal,
                    latitude: latVal,
                },
                success: function (result) {
                    if (200 === parseInt(result.status)) {
                        if (1 === parseInt(result.data)) {
                            alert("修改信息点成功");
                            $("#addInfoForm")[0].reset();
                            window.location.href = '/info/page';
                        } else {
                            alert("修改信息点出现错误");
                        }
                    } else {
                        alert("服务器错误");
                    }
                },
                error: function (error) {

                }
            })
        });

        $("#back").on('click', () => {
            window.history.back();
        })
    })
</script>
</body>
</html>